<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Axios</title>
    <script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
</head>

<body>
    <button>get</button>
    <button>post</button>
    <button>通用</button>
</body>
<script>
    const btn = document.querySelectorAll('button');
    // 配置baseURL
    axios.defaults.baseURL = 'http://127.0.0.1:8000';
    btn[0].onclick = function() {
        axios.get('/axios?ID=12345', {
            //传参方式一
            params: {
                id: 1,
                name: 'axios'
            },
            // 请求头信息
            headers: {
                id: 2,
                name: 'axios2'
            },
        }).then(function(response) {
            console.log(response);
        }).catch(function(error) {
            console.log(error);
        })
    };
    btn[1].onclick = function() {
        axios.post('/axios?id=123456')
            .then(res => {
                console.log(res);
            })
            .catch(err => {
                console.log(err);
            })
    }
    btn[2].onclick = function() {
        axios({
            url: '/axios',
            method: 'POST',
            params: {
                id: 1,
                name: 'all'
            },
        }).then(res => {
            console.log(res);
            console.log(res.status); //响应状态码
            console.log(res.statusText); //响应状态字符串
            console.log(res.headers); //响应头信息
            console.log(res.data); //响应体
        }).catch(err => {
            console.log(err);
        })
    }
</script>

</html>